// 引入react
import * as React from 'react';
import {StyleSheet, View, Text, ScrollView, TouchableOpacity, TextInput} from 'react-native';
import AllStyle from '../../../../../style';
import {HeaderTitle} from '../../../../../componet/settingComponent/HeaderTitle';
import {SafeAreaView} from 'react-native-safe-area-context';
import {BottomButton} from '../../../../../componet/settingComponent/BottomButton';
import {Toast} from '../../../../../utils/Toast';
import {setPassword} from '../../../../../api/user';
import {Loading} from '../../../../../utils/Loading';

/**
 * @Description:
 * @author TangYong
 * @date 2023/3/13
 */
export class SetPassword extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            oldPassword:'',
            newPassword:'',
            turePassword:'',
        };
    }
    //生命周期：组件挂载后
    componentDidMount() {
    }

    //方法
    back = () => {


        let route = {
            name: 'mySetting',
            params: {
                title: '个人信息',
            },
        };
        this.props.navigation.navigate(route);
    };
    goto = (name, params) => {

        const route = {
            name: name,
            params: {
                routePathName: this.props.route.name,
                ...params,
            },

        };
        this.props.navigation.navigate(route);
    };
    onChangeOldPassword=(text)=>{
        this.setState({oldPassword:text})
    }
    onChangeNewPassword=(text)=>{
        this.setState({newPassword:text})
    }
    onChangeTurePassword=(text)=>{
        this.setState({turePassword:text})
    }
    save=()=>{
        //判断密码是否合法
        //判断第一次密码和第二次密码是否一致
        if (!this.state.oldPassword){
            Toast.showWarning("老密码不能为空")
            return
        }
        if (!this.state.newPassword){
            Toast.showWarning("新密码不能为空")
            return
        }
        if (!this.state.turePassword){
            Toast.showWarning("确认密码不能为空")
            return
        }
        if (this.state.newPassword!=this.state.turePassword){
            Toast.showWarning("确认密码与新密码不一致")
            return
        }
        let data={
            'password': this.state.oldPassword,
            'newPassword': this.state.turePassword
        }
        Loading.show()
        setPassword(data).then(res=>{
            Loading.show()
            this.back();
        }).catch(err=>{
            Loading.show()
            Toast.showWarning(err.toString())
        }).finally(()=>{
            Loading.hidden();
        })


    }
    //DOM
    render() {
        return (
            <SafeAreaView edges={['top', 'left', 'right', 'bottom']} style={{flex: 1, backgroundColor: '#FFF'}}>
                <View style={AllStyle.container}>
                    <HeaderTitle goBack={() => {
                        this.back();
                    }} headtitle={'修改密码'}
                    />

                    <ScrollView style={{paddingTop:15}}>

                            <View style={style.formItem}>
                                <Text style={style.formTitle}>老密码:</Text>
                                <TextInput
                                    style={{
                                        textAlign: 'left',
                                        borderColor: 'transparent',
                                        backgroundColor: '#fff',
                                        borderWidth: 1,
                                        padding: 15,
                                        fontSize: 16,
                                    }}
                                    maxLength={15}
                                    placeholder='请输入老密码'
                                    secureTextEntry={true}
                                    onChangeText={text => this.onChangeOldPassword(text)}
                                    value={this.state.oldPassword}
                                />
                        </View>

                        <View style={style.formItem}>
                            <Text style={style.formTitle}>新密码:</Text>
                            <TextInput
                                style={{
                                    textAlign: 'left',
                                    borderColor: 'transparent',
                                    backgroundColor: '#fff',
                                    borderWidth: 1,
                                    padding: 15,
                                    fontSize: 16,
                                }}
                                maxLength={15}
                                placeholder='请输入新密码'
                                secureTextEntry={true}
                                onChangeText={text => this.onChangeNewPassword(text)}
                                value={this.state.newPassword}
                            />
                        </View>
                        <View style={style.formItem}>
                            <Text style={style.formTitle}>确认密码:</Text>
                            <TextInput
                                style={{
                                    textAlign: 'left',
                                    borderColor: 'transparent',
                                    backgroundColor: '#fff',
                                    borderWidth: 1,
                                    padding: 15,
                                    fontSize: 16,
                                }}
                                maxLength={15}
                                placeholder='请再次输入新密码'
                                secureTextEntry={true}
                                onChangeText={text => this.onChangeTurePassword(text)}
                                value={this.state.turePassword}
                            />
                        </View>
                    </ScrollView>
                </View>
                <BottomButton click={() => this.save()} title='保存'></BottomButton>

            </SafeAreaView>
        )
    }

}

const style = StyleSheet.create({
    //样式
    formItem:{
        marginBottom: 10,
    },
    formTitle:{
      marginLeft:5,
        marginBottom:5,
    }
})

